<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Toolbar Dropdown</title>
    <script src="./xlsx.js"></script>
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.2/xlsx.full.min.js"></script> -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <style>
        .mvctool a {
            display: inline-block;
            padding: 5px 10px;
        }

        .dropdown-menu {
            display: none;
            position: absolute;
        }

        #copy {
            background-color: rgb(240, 240, 240);
            border: 1px solid rgb(240, 240, 240);
        }
    </style>
    <!-- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> -->
</head>

<body>

    <div class="mvctool">
        <a href="#" onclick="add()">Link 1</a>
        <a href="#" onclick="add()">Link 2</a>
        <a href="#" onclick="add()">Link 3</a>
        <a href="#" onclick="add()">Link 1</a>
        <a href="#" onclick="add()">Link 2</a>
        <!-- 29+44+38  -->
        <a href="#">Link 3</a>
        <a href="#">Link 1</a>
        <a href="#">Link 2</a>
        <a href="#">Link 3</a>
        <a href="#">Link 1</a>
        <a href="#">Link 2</a>
        <a href="#">Link 3</a>
        <a href="#">Link 2</a>
        <a href="#">Link 3</a>
        <button>阿斯顿</button>
        <!-- More links here -->
    </div>
    <!-- <div id="someOtherDiv"></div>
    <br>
    <div id="copy">as1</div>
    <button class="btn">定时器</button>
    <button class="btn2">点击</button> -->

    <div class="" id="my-menu-panel">
        <div class="my-easyui-panel" title="选项">
            选项
        </div>
        <div class="my-easyui-menu" data-options="inline:true" style="width:100%;">
            <div class="my-menu-btn">设置</div>
            <div class="my-menu-btn" onclick="copyContent()">复制</div>
            <div class="my-menu-btn" onclick="exportBtnFn()">导出当前页</div>
            <div class="my-menu-btn" onclick="exportBtnFn('all')">导出所有页</div>
        </div>

    </div>
    <style>
        #menu-panel {
            background-color: #f3f3f3;
            width: 120px;
            border: 1px solid rgba(186, 186, 186);
        }

        .my-easyui-panel {
            width: 100%;
            padding: 1px 0;
            text-align: center;
            border-bottom: 1px solid rgba(211, 211, 211);
        }

        .my-menu-btn {
            padding: 2px 0;
            padding-left: 15px;
            font-size: 14px;
        }

        .my-menu-btn:hover {
            background-color: rgba(231, 234, 236);
            /* 鼠标经过时的背景色 */
            cursor: pointer;
        }
    </style>
    <script>
        //     $('.btn').click(() => {

        //     })
        //     // let timerId = setTimeout(function () {
        //     //     console.log('郭枫')
        //     // }, 2000);
        //     function add() {
        //         console.log('123123')
        //     }
        //     // $(document).ready(function () {
        //     //     // 假设你有一个id为'myDiv'的div，里面包含了a标签
        //     //     var $aTags = $('.mvctool').clone(true);
        //     //     var $div = $('.mvctool');
        //     //     var clonedElements = $div.find('*').clone(true);
        //     //     console.log(clonedElements)
        //     //     $('#copy').empty()
        //     //     $('#copy').append(clonedElements)
        //     //     // 现在$clonedElements包含了'myDiv'下的所有元素的副本，包括事件处理程序
        //     //     // 你可以将$clonedElements保存到一个数组中或者进行其他操作
        //     //     // 现在$aTags是一个包含了所有复制的a标签的jQuery对象，
        //     //     // 它们具有相同的事件处理程序。

        //     //     // 如果你想要将这些a标签添加到页面的另一个位置，可以这样做：
        //     //     $('#someOtherDiv').append($aTags);

        //     //     console.log(31.5 + 7 + 28.8 + 35.2)
        //     //     let div = document.getElementsByClassName('div')
        //     //     console.log(div)
        //     //     var $toolbar = $('.mvctool');
        //     //     var $links = $toolbar.find('a');
        //     //     var maxWidth = $toolbar.width();

        //     //     $links.each(function () {
        //     //         var $link = $(this);
        //     //         $link.after('<div class="dropdown-menu"></div>');
        //     //         var $dropdown = $link.next('.dropdown-menu');
        //     //         $dropdown.append($links.clone());
        //     //         $dropdown.find('a').css('display', 'block');

        //     //         var totalWidth = $link.position().left + $link.outerWidth();
        //     //         if (totalWidth > maxWidth) {
        //     //             $dropdown.show();
        //     //             $link.addClass('dropdown-link').text('Menu');
        //     //             $dropdown.find('a').click(function () {
        //     //                 window.location.href = $(this).attr('href');
        //     //             });
        //     //         }
        //     //     });
        //     // });
        // </script>

    <script>
        // import xlsx from "https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.2/xlsx.full.min.js"
        //     function a() {
        //         console.log(1);
        //         return function b() {
        //             console.log(2);
        //         }
        //     }
        //     var btn = document.querySelector('.btn2');
        //     btn.onclick = a();
        // btn.onclick = a; 

        // const xlsx = require('./xlsx.js');
        // import './xlsx.js';
        function appendEmptyStringToNumbers(array) {
            return array.map(row => row.map(item => String(item) + ''));
        }
        function exportToExcel(data, fileName) {
            // 创建工作簿
            const wb = XLSX.utils.book_new();
            let data2 = appendEmptyStringToNumbers(data);

            // 将二维数组转换为工作表
            const ws = XLSX.utils.aoa_to_sheet(data2);

            // 将工作表添加到工作簿
            XLSX.utils.book_append_sheet(wb, ws, "Sheet1");

            // 生成Excel文件
            XLSX.writeFile(wb, fileName + ".xlsx");
        }
        /*
        
    */

        // 示例数据
        const data = [
            ['ID', 'Name', 'Age'],
            [1, 'Alice', 23],
            [2, 'Bob', 30],
            [3, 'Charlie', 28],
            [123123123123123123, '2024-12-12 12:12:12']
        ];
        // 导出Excel文件
        exportToExcel(data, "myExcelFile");
    </script>

</body>

</html>